/**
 * Created by Joe on 2017/8/23 0023.
 */

var Images = {
    parent_target: "#real_img_new",
    form_target: "#createNew-form",
    uploadedImgCacheArr: [],
    setImagesParentTarget: function (target) {
        Images.parent_target = target;
    },
    setFormParentTarget: function (target) {
        Images.form_target = target;
    },
    iteratorImagelist: function (imageList, parentTarget) {
        // console.log("imageLIst: ", imageList);
        if (imageList && imageList.length > 0) {
            $.each(imageList, function (key, value) {
                /** 上传成功 */
                value.optClass = "setCover";
                value.optName = '设为主图';
                value.imageUrl = value.aliyunUrl;
                /** 封面主图加标签 */
                if (value.isCover == '1') {
                    value.labelName = '主图';
                    value.labelCls = 'label label-danger';
                    value.coverflag = "cover";
                } else {
                    value.optRemove = "删除";
                }
                Images.uploadedImgCacheArr.push(value.id);
                Utils.load_template(value, "images_tpl", parentTarget).done(function () {
                    Images.initColorbox();
                });
            });
        }
        /* save new uploaded images for goods when update goods info  */
       /* if (Images.uploadedImgCacheArr && Images.uploadedImgCacheArr.length > 0) {
            $(Images.form_target).remove(".imageIds");
            $.each(imageList, function (key, value) {
                var ele = ' <input type="hidden" class="imageIds" name="imageList" value="'+value.id+'">';
                $(Images.form_target).prepend(ele);
            })
        }*/
    },

    /**
     * 设置封面图片
     * 注意:如果页面设计调整,方法需要重构
     * @param target
     */
    setCover: function (target) {
        var parentContainer = target.parents("ul");//获取图片ul容器
        var oriCoverTarget = parentContainer.children('.cover');

        oriCoverTarget.find(".label:first-child").empty();
        oriCoverTarget.find(".remove-img").text("删除");

        $('.label.label-danger ').removeClass('label label-danger ');
        target.parents(".need-cut-item").find(".label-holder").children().addClass('label label-danger ')
        target.parents(".need-cut-item").addClass('cover');
        target.parents(".need-cut-item").find(".label:first-child").text("主图");
        target.parents(".need-cut-item").find(".remove-img").empty();
    },
    /**
     * 删除图片
     * 注意:如果页面设计调整,方法需要重构
     * @param target
     */
    removeById: function (target) {
        var parentContainer = target.parents("ul");//获取图片ul容器
        target.parents('.need-cut-item').remove();
        var childLength = parentContainer.children('.need-cut-item').length;
        if (childLength == 0) {//图片父容器没有图片,则隐藏root元素
            parentContainer.parent().hide();
        }
    },

    removeAjaxSubmit: function (imgId, targetEle) {
        var url = /*[[@{/removeImg}]]*/ 'removeImg';
        var goodsId = $("#current_goodsId").val();
        url = url.concat("?").concat("goodsId=").concat(goodsId).concat("&").concat("imgId=").concat(imgId);
        Utils.ajaxSubmit(url, {}).done(function (data) {
            if (data.result == "success") {
                Images.removeById(targetEle);
                Images.uploadedImgCacheArr.remove(imgId);
            }
        });
    },
    setCoverAjaxSubmit: function (imgId, targetEle) {
        var url = /*[[@{/setAsCover}]]*/ 'setAsCover';
        //检查是否允许修改
        var goodsId = $("#current_goodsId").val();
        url = url.concat("?").concat("goodsId=").concat(goodsId).concat("&").concat("imgId=").concat(imgId);
        Utils.ajaxSubmit(url, {}).done(function (data) {
            if (data.result == "success") {
                Images.setCover(targetEle);
            }
        });
    },
    /**
     * init plugin colorbox
     * */
    initColorbox: function () {

        $('.cboxElement').colorbox({
            reposition: true,
            scalePhotos: true,
            scrolling: false,
            previous: '<i class="icon-arrow-left"></i>',
            next: '<i class="icon-arrow-right"></i>',
            close: '&times;',
            current: '图片 {current} 共 {total}',
            maxWidth: '100%',
            maxHeight: '100%',
            rel: 'cboxElement',
            href: function () {
                var url = $(this).attr('href');
                //url = url.substring(0,url.lastIndexOf("!162x108"));
                return url;
            },
            slideshow: false,
            onOpen: function () {
                //console.log('onOpen: colorbox is about to open');
            },
            onLoad: function () {
                //console.log('onLoad: colorbox has started to load the targeted content');
            },
            onComplete: function () {
                //console.log('onComplete: colorbox has displayed the loaded content');
            },
            onCleanup: function () {
                //console.log('onCleanup: colorbox has begun the close process');
            },
            onClosed: function () {
                //console.log('onClosed: colorbox has completely closed');
            }
        });
        //let's add a custom loading icon
        $("#cboxLoadingGraphic").append("<i class='icon-spinner orange'></i>");
    }
};

